[Ajax] 전달받은 responseText의 데이터를 객체로 변환 및 출력하기

Ajax등의 비동기 통신으로 받은 데이터가 문자열이나 객체 구조를 띄는 경우가 있습니다. 실제로 데이터베이스 또는 로컬에 저장할때 문자열로 변환 후 저장하기도 하는데 이런 경우 다시 객체 구조로 변환해야 사용할 수 있죠. 이 방법으로 JSON.parse()를 사용합니다.

# JSON.parse()를 사용하여 객체로 변환하기

아래 예제는 받아온 데이터가 responseText라는 변수에 저장하였고 이를 다시 변환해 사용하는 간단한 예제입니다.

먼저 responseText에는 다음과 같은 문자열이 저장되어 있습니다.

매우 간단한 예제코드입니다. 이제 위 텍스트를 객체 형태로 변환해볼까요? 아래를 봐주세요.


위 result의 값은 변환되어 객체타입으로 저장된 값이 있습니다. 그래서 프로퍼티를 조회하거나 값을 가져올 수 있습니다.

! 왜 문자열로 변환하는가?

문자열로 변환해 저장하는 이유는 인코딩이 필요하거나 저장되는 공간이 문자열만 가능한 경우이거나 최대한 단순한 구조로 저장하기 위함입니다.